import React, { useEffect } from 'react';
import { RouteComponentProps } from 'react-router-dom';
import { Header, Footer, Brand, Attestation } from '../../components';
import { Input, Button } from 'antd';
import './Home.less';
import { ceshi } from '../../http/api';
import { SearchOutlined } from '@ant-design/icons';
import writelogo from '../../assets/img/writelogo.png';
// interface MatchParams {
//   touristRouteId: string;
// }

export const Home: React.FC<RouteComponentProps> = (props) => {
  useEffect(() => {
    console.log('调用次数');
    ceshi({}).then((res) => {
      console.log(res);
    });
  }, []);
  // const h = window.innerHeight - 110;
  const h = 280;
  return (
    <div>
      <Header></Header>
      <Attestation />
      <div className='home' style={{ height: h, background: '#c10c21' }}>
        {/* 'c10c21' */}
        <div className='bigbox'>
          <div className='searchbox'>
            <div>
              <img src={writelogo} alt='' />
            </div>
            <div>
              <Input
                placeholder='请填写车辆VIN码'
                prefix={<SearchOutlined className='searchicon' />}
              />
              <Button type='primary'>快速询价</Button>
            </div>
          </div>
        </div>
        <iframe
          title='背景'
          src='https://jianghaifei.top/start/index.html'
          width='100%'
          height={h}
          scrolling='no'
          frameBorder='0'
        />
      </div>
      <Brand></Brand>
      <Footer></Footer>
    </div>
  );
};
